import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import postcssPxToViewport from 'postcss-px-to-viewport'
import commonjs from '@rollup/plugin-commonjs'; // 引入 CommonJS 支持插件
import path from 'path'; // 必须引入 path 模块

// https://vite.dev/config/
export default defineConfig({
  plugins: [
    react(),
    commonjs()
  ],
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src'), // 关键配置
    },
  },
  css: {
    preprocessorOptions: {
      scss: {
        additionalData: `@import "@/styles/variables.scss";`,
      },
    },
    injectGlobalStyles: true,
    postcss: {
      plugins: [
        // 使用 CommonJS 导入的插件
        postcssPxToViewport({
          viewportWidth: 750, // 设计稿宽度（如 750px）
          viewportUnit: 'vw',
          propList: ['*'], // 转换所有属性
          unitPrecision: 5,
        }),
      ],
    },
  }
})
